/**********底部导航栏部分***************/
footer{
    position: fixed;
    bottom: 0;
    background: #6FA8EB;
    height: 3.5rem;
    z-index: 99;
    -webkit-box-shadow: 0 -1px 2px #DDD;
    -moz-box-shadow: 0 -1px 2px #DDD    ;
    box-shadow: 0 -1px 2px #DDD    ;
}
.bar_foot>li{
    float: left;
    width: 33%;
    height: 4rem;
    text-align: center;
}
.bar_foot>li>a{
    display: inline-block;
    width: 100%;
    height:100%;
    color: #FFF;
}
.bar_ico{
    display: inline-block;
    width:1.5rem;
    height:1.5rem;
    background-repeat: no-repeat;
    background-size:1.5rem 1.5rem;
    margin-top: .5rem;
}
.bar_home i{
    background-image: url("../images/ico/home1.png");
}
.bar_home .active i{
    background-image: url("../images/ico/home2.png");
}
/*.bar_shop i{*/
    /*background-image: url("../images/ico/shop1.png");*/
/*}*/
/*.bar_shop .active i{*/
    /*background-image: url("../images/ico/shop2.png");*/
/*}*/
.bar_kownledge i{
    background-image: url("../images/ico/knowledge1.png");
}
.bar_kownledge .active i{
    background-image: url("../images/ico/knowledge2.png");
}
.bar_center i{
    background-image: url("../images/ico/center1.png");
}
.bar_center .active i{
    background-image: url("../images/ico/center2.png");
}
.active p{
    color: #FFCF7B;
}

.box-container {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    visibility: hidden;
    z-index: 1000;
}

.box-container .box-inner {
    transform: translateY(20%);
    opacity: 0;
    transition: all 0.3s ease-out;
}

.box-container .box-inner .close {
    position: absolute;
    top: 20px;
    right: 20px;
    transition: all 1.5s ease-out;
    cursor: pointer;
}

.box-container-active {
    visibility: visible;
}

.box-container-active .box-inner {
    transform: translateY(0);
    opacity: 1;
    transition: all 0.3s ease-in-out;
}

.box-container-active .box-inner .close {
    transform-origin: 53% 47%;
    -webkit-transform-origin: 53% 47%;
    transform: rotate(720deg);
}

.modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    background-color: rgba(0, 0, 0, 0.3);
    display: none;
}
